<template>
    <div id="app" :class="header.title ? `padding-top` : ``">
        <LayerHeader />

        <!-- <div class="miva-test">
            <router-link to="/login">登陆</router-link>
            <router-link to="/ChangePasw">修改密码页面</router-link>
            <router-link to="/BasicInfo">基本信息</router-link>
            <router-link to="/PersonalityInfo">个性信息</router-link>

            <router-link to="/home">首页</router-link>
            <router-link to="/MatchInfo">匹配信息</router-link>
            <router-link to="/Othersdynami">他人动态</router-link>
            <router-link to="/Othersphoto">他人相册</router-link>
            <router-link to="/Activities">活动页面</router-link>
            <router-link to="/ActiveDetails">活动详情页面</router-link>

            <router-link to="/dynamic">动态</router-link>
            <router-link to="/Releasedynamic">发布动态</router-link>

            <router-link to="/my">我的</router-link>
            <router-link to="/profile">我的资料</router-link>
            <router-link to="/mydynamic">我的动态</router-link>
            <router-link to="/myphoto">我的相册</router-link>
            <router-link to="/DeletePhoto">删除照片</router-link>
        </div> -->

        <router-view />

        <!-- 遮罩 -->
        <van-overlay :show="maskShow" />
        <div v-show="maskShow" class="loading">
            <van-loading size="50px" color="#f45050" vertical />
        </div>

        <navbar />
    </div>
</template>

<script>
// item
import LayerHeader from '@/components/layer/header';
import navbar from '@/components/layer/navbar';
// vuex
import { mapGetters } from 'vuex';
export default {
    components: {
        LayerHeader,
        navbar
    },
    data() {
        return {
            upShow: true
        };
    },
    computed: {
        ...mapGetters(['header', 'maskShow'])
    }
};
</script>

<style lang="less">
body {
  margin: 0;
  padding-bottom: 55px;
  font-family: "微软雅黑";
  overflow-x: hidden;
}
.padding-top {
  padding-top: calc(45px);
}

.miva-test {
  width: 100%;
  position: fixed;
  top: 45px;
  z-index: 748943649;
  white-space: nowrap;
  overflow-x: scroll;
  a {
    display: inline-block;
    padding: 5px;
    box-sizing: border-box;
    border: 1px solid #fff;
    background-color: #f45050;
    color: #fff;
  }
}
.loading {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: calc(748943649 + 10);
}
</style>
